<template>
	<div class="publicformview">
		<el-form :rules='rules' label-width='100px' :inline="true" :disabled='blockType==3' :model="listQuery" size="mini" ref="addForm"
			style="margin-top: 20px;">
			<el-row :gutter="24">
				<el-col :span="6">
					<el-form-item label="所号：" prop="blockno">
						<el-input v-model="listQuery.blockno" disabled></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="编号：" prop="roomid">
						<el-input v-model="listQuery.roomid" disabled></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="建档单位：" prop="creatingdept">
						<el-select v-model="listQuery.creatingdept" disabled>
							<div v-for="(item,index) in bumenList" :key="index">
								<el-option :label="item.dname" :value="item.dname" :key="index"></el-option>
							</div>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="启始日期：" prop="startdate">
						<el-date-picker v-model="listQuery.startdate" type="date" placeholder="年/月/日">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="门号：" prop="buildingdoorno">
						<el-input v-model="listQuery.buildingdoorno"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="楼层：" prop="floorno">
						<el-input v-model="listQuery.floorno"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="性质：" prop="livingway">
						<el-input v-model="listQuery.livingway"></el-input>
						<!-- <el-select v-model="listQuery.livingway">
							<el-option label="发布" value="1" key="1"></el-option>
							<el-option label="不发布" value="0" key="0"></el-option>
						</el-select> -->
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="启始原因：" prop="startcause">
						<el-input v-model="listQuery.startcause"></el-input>
						<!-- <el-select v-model="listQuery.startcause">
							<el-option label="发布" value="1" key="1"></el-option>
							<el-option label="不发布" value="0" key="0"></el-option>
						</el-select> -->
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="单元：" prop="apartmentno">
						<el-input v-model="listQuery.apartmentno"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="计租间：" prop="rentflag">
						<el-input v-model="listQuery.rentflag"></el-input>
						<!-- <el-select v-model="listQuery.rentflag">
							<el-option label="发布" value="1" key="1"></el-option>
							<el-option label="不发布" value="0" key="0"></el-option>
						</el-select> -->
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="用途：" prop="use">
						<el-input v-model="listQuery.use"></el-input>
						<!-- <el-select v-model="listQuery.status">
							<el-option label="发布" value="1" key="1"></el-option>
							<el-option label="不发布" value="0" key="0"></el-option>
						</el-select> -->
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="终止日期：" prop="stopdate">
						<el-date-picker v-model="listQuery.stopdate" type="date" placeholder="年/月/日">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="间号：" prop="roomno">
						<el-input v-model="listQuery.roomno"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="自然间：" prop="roomflag">
						<el-input v-model="listQuery.roomflag"></el-input>
						<!-- <el-select v-model="listQuery.status">
							<el-option label="发布" value="1" key="1"></el-option>
							<el-option label="不发布" value="0" key="0"></el-option>
						</el-select> -->
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="终止原因：" prop="stopcause">
						<el-input v-model="listQuery.stopcause"></el-input>
						<!-- <el-select v-model="listQuery.status">
							<el-option label="发布" value="1" key="1"></el-option>
							<el-option label="不发布" value="0" key="0"></el-option>
						</el-select> -->
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="变动日期：" prop="changedate">
						<el-date-picker v-model="listQuery.changedate" type="date" placeholder="年/月/日">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="变动原因：" prop="changetype">
						<el-input v-model="listQuery.changetype"></el-input>
					<!-- 	<el-select v-model="listQuery.status">
							<el-option label="发布" value="1" key="1"></el-option>
							<el-option label="不发布" value="0" key="0"></el-option>
						</el-select> -->
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="长*宽(米)：" prop="lenthWidth">
						<el-input v-model="listQuery.lenthWidth"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="建筑面积：" prop="buildingarea">
						<el-input v-model="listQuery.buildingarea"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="计租面积：" prop="rentarea">
						<el-input v-model="listQuery.rentarea"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="使用面积：" prop="usingarea">
						<el-input v-model="listQuery.usingarea"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="原值：" prop="oldvalue">
						<el-input disabled v-model="listQuery.oldvalue"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="现值：" prop="nowvalue">
						<el-input disabled v-model="listQuery.nowvalue"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="类别：" prop="usetype">
						<el-input v-model="listQuery.usetype"></el-input>
						<!-- <el-select v-model="listQuery.usetype">
							<el-option label="发布" value="1" key="1"></el-option>
							<el-option label="不发布" value="0" key="0"></el-option>
						</el-select> -->
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="备注：" prop="roommemo1">
						<el-input v-model="listQuery.roommemo1"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
		</el-form>
		<div class="bottomTop" v-if="blockType!=3">
			<el-button type="primary" size="mini" @click="handleAddUser">完成复制</el-button>
		</div>
	</div>
</template>

<script>
	import dayjs from 'dayjs'
	import {
		houseAdminList,
		addRoom,
		roomDetails,
		updRoom
	} from '@/api/industry'
	export default {
		props:{
			blockType:String,
			roomid:String
		},
		name: "canquanqingkuang",
		data() {
			return {
				listQuery: {
					blockno:'',
					roomid:'',
					creatingdept:'',
					startdate:'',
					buildingdoorno:'',
					floorno:'',
					livingway:'',
					startcause:'',
					apartmentno:'',
					rentflag:'',
					usetype:'',
					stopdate:'',
					roomno:'',
					roomflag:'',
					stopcause:'',
					changedate:'',
					changetype:'',
					lenthWidth:'',
					buildingarea:'',
					rentarea:'',
					usingarea:'',
					oldvalue:'',
					nowvalue:'',
					use:'',
					roommemo1:''
				},
				rules: {
					buildingarea: [
						{ required: true, message: '请输入建筑面积', trigger: 'blur' }
					],
					rentarea: [
						{ required: true, message: '请输入计租面积', trigger: 'blur' }
					],
					usingarea: [
						{ required: true, message: '请输入使用面积', trigger: 'blur' }
					]
				},
				total: 0,
				options: [{
					key: "1"
				}],
				listLoading: false,
				dialogVisible: false,
				isChanquan: true,
				type: 1,
				// 部门列表
				bumenList: []
			};
		},

		computed: {
		},

		mounted() {
			if(this.roomid){
				let data = {
					RoomID:this.roomid
				}
				roomDetails(data).then(res=>{
					console.log(res)
					this.listQuery = res.data
				})
			}
					this.houseAdminList()
		},

		methods: {
			// 部门列表
			houseAdminList() {
				let data = {
					AName: '',
					DID: '',
					pageSize: 9999,
					pageNum: ''
				}
				this.listLoading = true;
				houseAdminList(data).then(res => {
					this.bumenList = res.data.list
					this.listLoading = false;
				})
			},
			resetForm(val) {
				console.log("1");
				this.$refs[val].resetFields();
			},
			handleAddUser() {
				this.$refs.addForm.validate((valid) => {
				if (valid) {
					let data = {
						blockno:this.listQuery.blockno,
						roomid:this.listQuery.roomid,
						creatingdept:this.listQuery.creatingdept,
						startdate:this.listQuery.startdate?dayjs(this.listQuery.startdate).format('YYYY-MM-DD HH:mm:ss'):"",
						buildingdoorno:this.listQuery.buildingdoorno,
						floorno:this.listQuery.floorno,
						livingway:this.listQuery.livingway,
						startcause:this.listQuery.startcause,
						apartmentno:this.listQuery.apartmentno,
						rentflag:this.listQuery.rentflag,
						usetype:this.listQuery.usetype,
						stopdate:this.listQuery.stopdate?dayjs(this.listQuery.stopdate).format('YYYY-MM-DD HH:mm:ss'):"",
						roomno:this.listQuery.roomno,
						roomflag:this.listQuery.roomflag,
						stopcause:this.listQuery.stopcause,
						changedate:this.listQuery.changedate?dayjs(this.listQuery.changedate).format('YYYY-MM-DD HH:mm:ss'):'',
						changetype:this.listQuery.changetype,
						lenthWidth:this.listQuery.lenthWidth,
						buildingarea:this.listQuery.buildingarea,
						rentarea:this.listQuery.rentarea,
						usingarea:this.listQuery.usingarea,
						oldvalue:this.listQuery.oldvalue,
						nowvalue:this.listQuery.nowvalue,
						use:this.listQuery.use,
						usetype:this.listQuery.usetype,
						roommemo1:this.listQuery.roommemo1,
						roomid:-1
					}
					addRoom(data).then(res=>{
						console.log(res)
						this.$message(res.message);
						localStorage.setItem('roomid',res.data.roomid)
					})
				} else {
					console.log('验证失败！');
					return false;
					}
				}); 
				
			},
			returns() {
				this.$router.go(-1)
			},
			// 选择类型
			selectButton(type) {
				this.type = type
			}
		},
	};
</script>

<style scoped>
	.headTop {
		width: 100%;
		display: flex;
		justify-content: space-between;
	
		.xinxi {
			display: flex;
			width: 800px;
		}
	}
	
	.el-form-item {
		justify-content: start !important;
	}
	
	.el-select {
		width: 180px;
	}
	
	.el-input {
		width: 180px;
	}
	
	.el-date-picker {
		width: 180px;
	}
	
	.bottomTop {
		width: 100%;
		display: flex;
		justify-content: end;
	}
	
	.tabButton {
		background: #EFF2F7;
		color: #333333;
		border: none;
	}
</style>